diff options
| author | Kyren223 <Kyren223@proton.me> | 2024-11-15 12:37:54 +0200 |
|---|---|---|
| committer | Kyren223 <Kyren223@proton.me> | 2024-11-15 12:37:54 +0200 |
| commit | fc001b14c00f530d106400149b9be69837d6952f (patch) | |
| tree | 1cb5eb9f8ac6329c1ac7c42ea1efc26aec044d09 /src/pages/blogs/[...slug].astro | |
| parent | 1a5f5622f2cc0e70e3c0775e64871e8a07d0eeaf (diff) | |
Mostly finished the custom markdown blog, still tweaking a bit
Diffstat (limited to 'src/pages/blogs/[...slug].astro')
| -rw-r--r-- | src/pages/blogs/[...slug].astro | 53 |
1 files changed, 38 insertions, 15 deletions
diff --git a/src/pages/blogs/[...slug].astro b/src/pages/blogs/[...slug].astro index b8fa5b4..dbd6b80 100644 --- a/src/pages/blogs/[...slug].astro +++ b/src/pages/blogs/[...slug].astro @@ -7,14 +7,20 @@ import TerminalBorder from "@components/TerminalBorder.astro"; export async function getStaticPaths() { const blogEntries = await getCollection("blogs"); - return blogEntries.map((entry) => ({ - params: { slug: entry.slug }, - props: { entry }, + return blogEntries.map((blog) => ({ + params: { slug: blog.slug }, + props: { entry: blog }, })); } const { entry } = Astro.props; const { Content } = await entry.render(); + +const blogs = await getCollection("blogs"); +const sortedBlogs = blogs.sort((a, b) => +b.data.date - +a.data.date); +const currentIndex = sortedBlogs.findIndex((blog) => blog.slug === entry.slug); +const previousBlog = sortedBlogs[currentIndex + 1] || undefined; +const nextBlog = sortedBlogs[currentIndex - 1] || undefined; --- <Terminal path="blogs/"> @@ -30,18 +36,35 @@ const { Content } = await entry.render(); <div class="markdown"> <Content components={{ a: Link }} /> </div> - <div class="ml-[1px] pt-2 grid grid-cols-[1fr_1fr] gap-4"> - <div class="min-w-0 invisible"></div> - <TerminalBorder header="Previous Blog"> - <Link href="next" newTab={false} - >vim ~/blogs/next-blog.md</Link - > - </TerminalBorder> - <TerminalBorder header="Next Blog"> - <Link href="next" newTab={false} - >vim ~/blogs/next-blog.md</Link - > - </TerminalBorder> + <div class="px-[1px] py-2 grid grid-cols-2 gap-4"> + { + previousBlog ? ( + <TerminalBorder header="Previous Blog"> + <span class="text-[var(--secondary)] truncate flex-1"> + <Link href={previousBlog.slug} newTab={false}> + vim ~/blogs/{previousBlog.slug}.md + </Link> + </span> + </TerminalBorder> + ) : ( + <div class="min-w-0 invisible" /> + ) + } + { + nextBlog ? ( + <TerminalBorder header="Next Blog"> + <div class="w-full flex items-center"> + <span class="text-[var(--secondary)] truncate flex-1"> + <Link href={nextBlog.slug} newTab={false}> + vim ~/blogs/{nextBlog.slug}.md + </Link> + </span> + </div> + </TerminalBorder> + ) : ( + <div class="min-w-0 invisible" /> + ) + } </div> </div> </div> |